<!DOCTYPE html>
<html lang="zxx">

<head>
	<title>益处案例</title>
	<!-- Meta Tags -->
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta charset="utf-8">
	<meta name="keywords" content="" />
	<script type="application/x-javascript">
		addEventListener("load", function () {
			setTimeout(hideURLbar, 0);
		}, false);

		function hideURLbar() {
			window.scrollTo(0, 1);
		}
	</script>
	<!-- // Meta Tags -->
	<!--booststrap-->
	<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all">
	<!--//booststrap end-->
	<!-- font-awesome icons -->
	<link href="css/fontawesome-all.css" rel="stylesheet">
	<!-- //font-awesome icons -->
	<link rel="stylesheet" href="css/lightbox.css"><!-- For-gallery-CSS -->
	<!--stylesheets-->
	<link href="css/style.css" rel='stylesheet' type='text/css' media="all">
	<!--//stylesheets-->
	<link href="http://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900" rel="stylesheet">
	<link href="http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900" rel="stylesheet">
</head>

<body>

	<!--/banner-->
	<!-- banner -->
	<header>
		<section class="banner1">
			<div class="agileits_w3layouts_banner_nav">

				<div class="header-bar py-sm-2">
					<div class="container py-2">
						<nav class="navbar navbar-expand-lg navbar-light">
							<div class="hedder-up">
								<h1><a class="navbar-brand" href="index.html">垃圾分类宣传网站系统</a></h1>
							</div>
							<button class="navbar-toggler" type="button" data-toggle="collapse"
								data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
								aria-expanded="false" aria-label="Toggle navigation">
								<span class="navbar-toggler-icon"></span>
							</button>
							<div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent">
								<ul class="navbar-nav">
									<li class="nav-item">
										<a class="nav-link" href="index.html">首页 <span
												class="sr-only">(current)</span></a>
									</li>
									<li class="nav-item">
										<a href="about.html" class="nav-link">垃圾分类</a>
									</li>
									<li class="nav-item">
										<a href="gallery.html" class="nav-link ">益处案例</a>
									</li>
									<li class="nav-item">
										<a href="codes.html" class="nav-link ">历史起源</a>
									</li>

									<li class="nav-item">
										<a href="contact.html" class="nav-link">联系我们</a>
									</li>
								</ul>
								
							</div>
						</nav>
					</div>
				</div>
				<!-- //Navigation -->
			</div>
		</section>
	</header>
	<!-- //banner -->
	<!--gallery-->
	<section class="gallery py-md-5">
		<div class="container py-4 mt-2">
			<h2 class="tittle text-center mb-3">益处案例</h2>
			<p class="tit text-center mx-auto">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius eum
				inventore consectetur dolorum, voluptatum possimus temporibus vel ab, nesciunt quod!</p>
			<div class="row gallery-info pt-4 mt-md-4">
				<div class="col-md-3 gallery-grids">
					<a href="images/g3.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g3.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g4.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g4.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g5.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g5.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g6.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g6.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g7.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g7.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g8.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g8.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g9.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g9.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g10.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g10.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g11.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g11.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g12.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g12.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g13.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g13.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
				<div class="col-md-3 gallery-grids">
					<a href="images/g14.jpg" class="gallery-box" data-lightbox="example-set" data-title="">
						<img src="images/g14.jpg" alt="" class="img-responsive zoom-img">
					</a>
				</div>
			</div>
			<script src="js/lightbox-plus-jquery.min.js"></script>
		</div>
	</section>
	<!--//gallery-->
	<div class="copyright py-3">
		<div class="container">
			<div class="copyrightbottom">
				<p>垃圾分类宣传网站系统</p>

			</div>
			<div class="clearfix"></div>
		</div>
	</div>
	<!-- //Modal -->

	<!--js working-->
	<script src="js/jquery.min.js"></script>
	<!--//js working-->
	<!-- smooth scrolling -->
	<script type="text/javascript" src="js/move-top.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<!-- here stars scrolling icon -->
	<script type="text/javascript">
		$(document).ready(function () {
			/*
				var defaults = {
				containerID: 'toTop', // fading element id
				containerHoverID: 'toTopHover', // fading element hover id
				scrollSpeed: 1200,
				easingType: 'linear' 
				};
			*/

			$().UItoTop({ easingType: 'easeOutQuart' });

		});
	</script>
	<!-- //here ends scrolling icon -->
	<!-- //smooth scrolling -->
	<!-- scrolling script -->
	<script type="text/javascript">
		jQuery(document).ready(function ($) {
			$(".scroll").click(function (event) {
				event.preventDefault();
				$('html,body').animate({ scrollTop: $(this.hash).offset().top }, 1000);
			});
		});
	</script>
	<!-- //scrolling script -->
	<script src="js/main.js"></script>
	<!--bootstrap working-->
	<script src="js/bootstrap.min.js"></script>
	<!-- //bootstrap working-->
</body>

</html>